<!--
 * @Author: your name
 * @Date: 2020-11-17 11:12:52
 * @LastEditTime: 2021-01-15 15:30:48
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /vue-next/Users/duodian/Documents/qugame/work-admin/src/views/equip/list.vue
-->
<template>
  <div class="detail">
    <OrderInfo :info="info"/>
    <AccountInfo :onSubmit="onSubmit" :gameAccountVo="gameAccountVo" :iframe="true" :account="account" :orderStatus="info.orderStatus" :cancelOrder="cancelOrder"/>
  </div>
</template>
<script>
import Modal from './modal'
import OrderInfo from './orderInfo'
import AccountInfo from './accountInfo'
import { formatDate } from '@/utils/utils'

export default {
  components: {
    Modal,
    OrderInfo,
    AccountInfo
  },
  data () {
    return {
      info: {
        'gameId': 1104466820,
        'hour': null,
        'paymentPrice': null,
        'platformType': 0,
        'receiveAddress': '',
        'receiveUserName': '',
        'receiveUserPhone': '',
        'thirdOrderNo': '',
        'thirdOrderTime': formatDate(new Date().getTime(), 'YYYY-MM-DD HH:MM:SS'),
        'spec': null
      },
      gameAccountVo: {},
      account: {}
    }
  },
  mounted () {
    const _this = this
    window.addEventListener('message', function (res) {
      // console.log(res, 999)
      if (res.data && res.data.url) {
        _this.info.dataId = res.data && res.data.url
        _this.gameAccountVo = res.data.gameAccountVo || {}
      }
    })
    if (this.$route.query.orderNo) {
      this.fetchDetail()
    }
    // this.fetchList()
    // this.fetchSelector()
    // console.log('test deploy 3345!!')
  },
  methods: {
    async onSubmit () {
      const loading = this.$loading({
        lock: true,
        text: '正在努力匹配账号中...',
        spinner: 'el-icon-loading',
        background: 'rgba(, 0, 0, 0.7)',
        customClass: 'loading-class'
      })
      const result = await this.$http.post('/thirdOrder/createOrder', this.info)
      loading.close()
      if (result.code !== '0') {
        return this.$message.error(result.desc)
      }
      this.$message.info('分配成功')
      this.account = result.data
      // this.fetchDetail()
      // console.log('submit!')
    },
    async fetchDetail () {
      const result = await this.$http.get(`/thirdOrder/thirdOrderDetail?orderNo=${this.$route.query.orderNo}`)
      if (result.code !== '0') {
        return this.$message.error(result.desc)
      }
      this.account = result.data.account
      this.info = result.data
    },
    // 取消订单
    async cancelOrder () {
      this.$confirm('此操作将取消该条订单, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        await this.$http.post('/thirdOrder/cancelOrder', {
          thirdOrderId: this.info.thirdOrderId
        })
        // if (result.code !== '0') {
        //   return this.$message.error(result.desc)
        // }
        // this.$message({
        //   type: 'success',
        //   message: '取消成功!'
        // })
        this.toOrder(this.info.orderNo)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },
    // 详情
    toOrder (orderNo) {
      this.$router.push({
          path: `/eCommerce/orders?orderNo=${orderNo}`
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.detail{
  padding: 10px;
  >div{
    width: 88%;
  }
}
</style>
